<template>
	<view>
		<view class="page">
			<view class="top" :style="`padding-top:`+$store.state.StatusBar.statusBar + `px`">
				<view class="top-icon" @click="back">
					<u-icon name='arrow-left' size="42rpx" color="#fff"></u-icon>
				</view>
				<view class="top-title c-fff">{{title}}</view>
			</view>
			<view class="body" :style="`margin-top:`+$store.state.StatusBar.statusBar + `px`">
				<view class="">
					<view class="flex flex-between flex-center p-24 border-box">
						<view class="c-999 t-right">
							<textarea style="border-radius: 30rpx; background-color: #333; text-align: left; padding:10rpx;"
							placeholder="给大家分享点什么吧~" v-model="message" name="" id="" cols="30" rows="10"></textarea>
						</view>
					</view>
				</view>
				<view style="text-align: left;">
					<view v-for="(item,index) in image" style="display: inline-block; margin-left:50rpx; position: relative;">
						<image :src="item" mode="aspectFill" style="width:90rpx; height:90rpx; border-radius: 30rpx; border:1px solid #666; padding:20rpx;" />
						<image @click="delImg(index)" src="./img/n_near_circle_close.png" style="width:20rpx; height:20rpx; position: absolute; top:0rpx;"></image>
					</view>
					<image @tap="chooseImg" src="./img/rc_ext_tab_add.png" style="width:90rpx; height:90rpx; border-radius: 30rpx; border:1px solid #666; padding:20rpx; margin-left:50rpx;" mode="aspectFill"></image>
					
				  </view>
				<view class="button" @click="submit">确定</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		to
	} from '@/utils/index.js';
	import { ossUpload } from '@/js_sdk/jason-alioss-upload/oss.js'
	import md5 from '@/utils/md5.js';
	export default {
		data() {
			return {
				title: '发布动态',
				info: {},
				image: [],
				nameArray: ['土豪男', '秀外惠中气质女', '霸道总裁', '傻白甜', '高富帅', '白富美', '萌妹子', '阳光型男', '文艺青年', '怪蜀黎', '泼辣妹子', '小鲜肉',
					'霸气女', '男女通吃'
				],
				setOutTimeArray: ['近期出发', '某个周末', '具体日期', '可商议', '说走就走'],
				reachTimeArray: ['当天往返', '一俩天', '三四天', '十天半个月', '还准备回来吗', '会不回不来'],
				travelArray: ['往返双飞', '秀外惠中气质女', '霸道总裁', '傻白甜', '高富帅', '白富美', '萌妹子', '阳光型男', '文艺青年', '怪蜀黎', '泼辣妹子', '小鲜肉',
					'霸气女', '男女通吃'
				],
				destination: '',
				tag: '',
				name: '请选择对象',
				setOutTime: '请选择出发时间',
				reachTime: '请选择预计时间',
				travel: '请选择出行方式',
				oss:{},
				message: '',
				type:1,
				media:''
			}
		},
		onLoad(option) {
		},
		onShow(option) {
			this.$c.post("/app/ossSts/getStsToken").then(res=>{
				this.oss = res.data
			});
			this.getInfo();
		},
		methods: {
			to,
			back() {
				to()
			},
			delImg(index){
				this.image.splice(index,1);
			},
			chooseImg() {
				uni.chooseImage({
					count: 6,
					success: async (file) => {
						const {success,data} = await ossUpload(file.tempFilePaths[0], file.tempFiles[0].path, 'image/')
					  // const {success,data} = await ossUpload(this.oss,file.tempFilePaths[0], file.tempFiles[0].path, 'image/')
					  if(success) {
						  console.log(data)
						  this.image.push(data)
						// this.headImage = data
					  } else {
						uni.showToast({icon:'none', title: data})
					  }
					}
				})
				// this.uploadOss(1,(res=>{
				// 	console.log(res)
				// }))
			},
			async getInfo() {
				// let res = await this.$c.post("/app/exchange/getList")
				// if(res.code != 0){
				// 	uni.navigateTo({
				// 	  url: '/im/login/login'
				// 	});
				// }
				// this.info = res.data
			},
			bindName(e) {
				this.name = this.nameArray[e.detail.value]
			},
			bindSetOutTime(e) {
				this.setOutTime = this.setOutTimeArray[e.detail.value]
			},
			bindReachTime(e) {
				this.reachTime = this.reachTimeArray[e.detail.value]
			},
			bindTravel(e) {
				this.travel = this.travelArray[e.detail.value]
			},
			async submit() {
				let res = await this.$c.post("/app/dongtai/addDongtaiVersion2?message=" + this.message + "&type=" + this.type ,{media:this.image.join(',')} );
				if (res.code != 0) {
					uni.showToast({
						title: res.msg,
						icon: "none"
					})
					return;
				}
				uni.showToast({
					title: "提交成功",
					icon: "none"
				})

				setTimeout(() => {
					// this.getInfo()
					// this.$router.go(0)
					this.to()
				}, 1000)
			}
		}
	}
</script>

<style scoped lang="scss">
	.page {
		// width: 100vw;
		padding: 30rpx;
		height: 100vh;
		// background: linear-gradient(#e3ecfb, #fdedf0, #fff, #fff);
	}

	.top {
		position: fixed;
		top: 0rpx;
		width: 100%;
		// background-color: #e3ecfb;
		z-index: 999;
		text-align: center;
		vertical-align: middle;
		padding: 10rpx;
	}

	.top-icon {
		position: absolute;
		left: 30rpx;
		z-index: 99;
		width: 30rpx;
		height: 30rpx;
	}

	.top-title {
		line-height: 50rpx;
		display: block;
		height: 50rpx;
		z-index: 99;
	}

	.body {
		padding-top: 40rpx;
		text-align: center;

		.title {
			margin-top: 40rpx;
			font-size: 24rpx;
		}

		.top-infr-icon {
			width: 26rpx;
			height: 26rpx;
			position: absolute;
			right: 50rpx;
			transform: translateY(-58rpx);
		}

		.top-infr-icon2 {
			width: 26rpx;
			height: 26rpx;
			position: absolute;
			right: 50rpx;
		}

		.button {
			background: linear-gradient(180deg, #FDB175 5%, #F49C66 100%);
			color: #fff;
			display: inline-block;
			padding: 20rpx 0rpx;
			border-radius: 50rpx;
			font-size: 32rpx;
			width: 80%;
			margin-top: 50rpx;
		}

		.mark {
			width: 100%;
			margin-top: 30rpx;
			text-align: left;
			font-size: 20rpx;
			color: #9d9395;
		}

		input {
			text-align: right;
			width: 500rpx;
		}

		.list {
			margin-top: 60rpx;

			.item {
				height: 80rpx;
				padding: 15rpx;
				position: relative;
				border: 1px solid red;

				.label {
					position: absolute;
					left: 20rpx;
					line-height: 80rpx;
					color: #fff;
				}

				.picker {
					height: 80rpx;
					text-align: right;
					margin-right: 80rpx;
				}



				span {
					position: absolute;
					right: 80rpx;
					color: #7f7f7f;
				}

				border-bottom:1px solid #fdedf0;
			}
		}
	}
</style>